<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
				font-size: 18px;
			}
			#tips{
				color: red;
			}
			#wrapper{
				position: absolute;
				left: 35%;
				top: 10%;
                width: 500px;
                background: #eee;
			}
			#wrapper-bottom{
				margin-top: 30px;
				
			}
			div{
				margin-top: 15px;
			}
			#zhuce{
				margin-left: 47%;
				margin-top: 20px;
				font-size: 20px;
			}
			span{
				color: black;
			}
			a{
				color:red;
				text-decoration:none ;
			}
			#tishi{
                display: none;
				float: right;
				font-size: 20px;
				width:66px;
				color: red;
			}
			#we{
				width: 400px;
				height: 100px;
				position: absolute;
				left: 54%;
				top: 50%;
				margin-left: -200px;
				margin-top: -50px;
				background: #ddd;
				font-size: 20px;
				display: none;
				z-index: 1;
			}
			#w,#w1{
				height:40px;
				width: 100px;
				margin-left: 50px;
				
			}
			#zhezhao{
				width: 500px;
				height: 420px;
				background: yellow;
				opacity: 0.5;
				float: left;
				display: none;
				position: absolute;
				left: 35%;
				top: 12%;
				z-index: 1;
				
			}
		</style>
	</head>
	<body>
		<span id="zhezhao">
		</span>
		<div id="we">
			Welcome to this website again !
			<input type="button" name="" id="w" value="确定" />
			<input type="button" name="" id="w1" value="取消" />
		</div>
		<div id="wrapper">
			<span id="tishi">
				请核对信息！
			</span>
			<span id="tips">
			    注意*为必填项	
			</span>
			<div id="wrapper-top">
				<div id="title">
					账户详细信息：
				</div>
				<div id="firstLine">
					<span id="spn">
						用户名称：*
					</span>
					<input type="" name="" id="first-ipt" value="" />
					<a id="dis1">
					</a>
				</div>
				<div id="secondLine">
					<span id="spn">
						登录密码：*
					</span>
					<input type="" name="" id="seconds-ipt" value="" />
					<a id="dis2">
					</a>
				</div>
				<div id="third-Line">
					<span id="spn">
						重复登录密码:*
					</span>
					<input type="" name="" id="third-ipt" value="" />
					<a id="dis3">
					</a>
				</div>
			</div>
			<div id="wrapper-bottom">
				<div id="titles">
					个人信息：
				</div>
				<div id="firstLine1">
					<span id="spn">
						电子邮件：*
					</span>
					<input type="" name="" id="first-ipt1" value="" />
					<a id="dis11">
						
					</a>
				</div>
				<div id="second-Line1">
					<span id="spn">
						真实姓名：*
					</span>
					<input type="" name="" id="second-ipt" value="" />
					<a id="dis22">
						
					</a>
				</div>
				<div id="third-Line">
					<span id="spn">
						中奖通知手机:*
					</span>
					<input type="" name="" id="third-ipt1" value="" />
					<a id="dis33">
					</a>
				</div>
			</div>
			<input type="button" name="zhuce" id="zhuce" value="注册" />
	    </div>
	    <script type="text/javascript" src="js/ajax.js">
	    	
	    </script>
	 <script type="text/javascript" src="cookie.js" charset="UTF-8">	
	 </script>
      <script type="text/javascript">
      	let sp = document.getElementsByTagName('a');
      	let wrapp = document.getElementById('wrapper');
      	let allIpt = document.getElementsByTagName('input');
      	let obutton = document.getElementById('zhuce');
      	let zhanghu = document.getElementById('first-ipt');
      	let mima = document.getElementById('seconds-ipt');
      	let realnames = document.getElementById('second-ipt')
      	let tip1 = document.getElementById('dis1');
      	let tip2 = document.getElementById('dis2');
      	let youxiang = document.getElementById('first-ipt1');
      	let tip4 = document.getElementById('dis11');
      	let shouji = document.getElementById('third-ipt1');
      	let tip6 = document.getElementById('dis33') ;
      	let chongfu = document.getElementById('third-ipt');
      	let queding = document.getElementById('dis3');
      	let tt = document.getElementById('tishi');
      	let owe = document.getElementById('we');
      	let op = document.getElementById('w');
      	let cancle = document.getElementById('w1');
      	let zhe = document.getElementById('zhezhao');
      	 if(getcookies('username'))
					{
						zhanghu.value = getcookies('username');
						mima.value = getcookies('password');
						owe.style.display = 'block'
						op.onclick = function(){
							location.href = 'loin.html';
						}
						cancle.onclick = function(){
							owe.style.display = 'none';
							zhe.style.display = 'none'
						}
						zhe.style.display = 'block';
						
					}
     obutton.onclick = function(){
      		var reg = /^[a-zA-Z]\w{6,12}/ig;
	      	var reg1 = /^.{6,12}$/;
	      	var reg3 = /^\w+[-+.]*\w*@([a-z1-6qq\u2E80-\u9FFF]-?)+(\.\w{2,6})+/;
	      	var reg4 = /^(156|158|188|)\d{8}$/;
	   setcookies('username',zhanghu.value,7);
	   setcookies('password',mima.value,7);
	      	if(reg.test(zhanghu.value)==false)
	      	{
	      		tip1.innerHTML = '格式错误！'
	      	}else{
	      		tip1.innerHTML = ''
	      	}
	      	if(reg1.test(mima.value)==false)
	      	{
	      		tip2.innerHTML = '格式错误！'
	      	}else{
	      		tip2.innerHTML = ''
	      	}
	      	if(reg3.test(youxiang.value)==false)
	      	{
	      		tip4.innerHTML = '格式错误!';
	      	}else{
	      		tip4.innerHTML = '';
	      	}
	      	if(reg4.test(shouji.value)==false)
	      	{
	      		tip6.innerHTML='格式错误！'
	      	}
	      	else{
	      		tip6.innerHTML=''
	      	}
	      	for(let i = 0 ; i<sp.length ; i ++)
      		  { 
      			if(sp[i].innerHTML != '')
      			{
      				tishi.style.display = 'block'
      			}else{
      				tishi.style.display = 'none'
      			}
      		}
      		  if(tishi.style.display != 'block')
      		  {
      		  	location.href='loin.html'
      		  }
      		  if(chongfu.value != mima.value)
					{
						queding.innerHTML = '两次密码输入不一致';
					}else{
						queding.innerHTML = ''
					}
			    var un  =zhanghu.value;
				var pw =mima.value;
				var phonenumber = shouji.value;
				var realname = realnames.value;
				var url ='http://jx.xuzhixiang.top/ap/api/reg.php?username=11&password=1212';
				console.log(url);	
				ajax(url,function(res){
					console.log(res);
					console.log(res);
					if(res.code == 1){
						alert('注册成功');
//						location.href = 'loin.html';
					}
				})			
      }
      </script>
	</body>
</html>
